<template>
  <div class="serch">
        <div class="serch-left">
          <img :src="LogoImg" width="150" />
        </div>
        <div class="serch-right">
          <input placeholder="请输入商品/店铺" />
          <span>搜索</span>
        </div>
      </div>
</template>

<script>
export default {
    data(){
        return{
            LogoImg: require("/src/assets/logo.png"),
        }
    }
}
</script>

<style>
.serch {
  height: 100px;
  line-height: 100px;
}
.serch-left {
  float: left;
  margin-left: -30px;
}
.serch-right {
  float: right;
  margin-right: 100px;
}
.serch-right input {
  width: 200px;
  height: 30px;
  border: 2px rgb(49, 49, 49) solid;
}
.serch-right span {
  display: inline-block;
  width: 60px;
  height: 31.5px;
  position: relative;
  color: rgb(255, 255, 255);
  background-color: rgb(247, 66, 66);
  line-height: 30px;
  border: 2px rgb(247, 66, 66) solid;
  letter-spacing: 6px;
}
</style>